﻿@model List<MengRan.Models.index.mens>
@{
    Layout = null;
}
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>layout 管理系统大布局 - Layui</title>
    <title>梦染</title>
    <link rel="stylesheet" href="~/lib/layui/css/layui.css">
    <script src="~/lib/layui/layui.js" charset="utf-8"></script>
    <script src="~/lib/jquery/dist/jquery.js"></script>
</head>
<body class="layui-layout-body">
    <div class="layui-fluid">
        <!-- 顶部区域 -->
        <div class="layui-layout-admin">
            <div class="layui-header">
                <ul class="layui-nav layui-layout-left">
                    <li class="layui-nav-item" lay-unselect="">
                        <a href="javascript:;" title="侧边伸缩">
                            <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible"></i>
                        </a>
                    </li>
                    <li class="layui-nav-item" lay-unselect="">
                        <a href="javascript:;" title="刷新">
                            <i class="layui-icon layui-icon-refresh-3"></i>
                        </a>
                    </li>
                </ul>
                <div class="layui-logo">
                    <span class="logo_dp">梦染管理系统</span>
                </div>
                <ul class="layui-nav layui-layout-right">
                    <li class="layui-nav-item">
                        <a href="javascript:;">
                            <img src="~/images/cs1.jpg" class="layui-nav-img">
                            <span id="mingziw">@Context.User.Identity.Name</span>
                        </a>
                        <dl class="layui-nav-child">

                            <dd>
                                <!--TODO -->
                                <!--需要修改为自己项目的部分：-->
                                <!--1、属性data-url（需要在右边选项卡中打开的页面的路径）  -->
                                <!--2、属性data-title（选项卡标题）-->
                                <!--3、属性data-id必须唯一，tab选项卡根据这个值进行切换-->

                                <a href="#" data-url="profile" data-title="个人资料" data-id="44" class="site-demo-active"
                                   data-type="tabAdd">
                                    个人资料
                                </a>
                            </dd>

                            <dd>
                                <!--TODO -->
                                <!--需要修改为自己项目的部分：-->
                                <!--1、属性data-url（需要在右边选项卡中打开的页面的路径）  -->
                                <!--2、属性data-title（选项卡标题）-->
                                <!--3、属性data-id必须唯一，tab选项卡根据这个值进行切换-->

                                <a href="#" data-url="password" data-title="修改密码" data-id="55" class="site-demo-active" data-type="tabAdd">
                                    修改密码
                                </a>
                            </dd>

                        </dl>
                    </li>
                    <li class="layui-nav-item">
                        <!--TODO -->
                        <!--可能需要修改路径-->
                        <a href="/Account/login">退出</a>
                    </li>
                </ul>

            </div>
            <div class="layui-side layui-bg-black">
                <div class="layui-side-scroll">
                    @*左侧导航区域 *@
                    <ul class="layui-nav layui-nav-tree layui-nav-flex" lay-filter="test">
                        @foreach (var item in Model.Where(p => p.zhuci==0).ToList())
                        {
                            @*<li class="layui-nav-item">
                                <a href="javascript:;"><i class="layui-icon layui-icon-home"></i> 系统管理</a>
                                <dl class="layui-nav-child">
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/denglu" data-id="1" data-title="登录日志"><i class="layui-icon layui-icon-home"></i>  登录日志</a>
                                    </dd>
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/chatmes" data-id="2" data-title="聊天记录"><i class="layui-icon layui-icon-home"></i>  聊天记录</a>
                                    </dd>
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/liuyan" data-id="3" data-title="留言管理"><i class="layui-icon layui-icon-home"></i>  留言管理</a>
                                    </dd>
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/yonghu" data-id="7" data-title="用户管理"><i class="layui-icon layui-icon-home"></i>  用户管理</a>
                                    </dd>
                                </dl>
                            </li>
                            <li class="layui-nav-item">
                                <a href="javascript:;"><i class="layui-icon layui-icon-auz"></i>功能集合</a>
                                <dl class="layui-nav-child">
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/tianqi" data-id="8" data-title="天气查询"><i class="layui-icon layui-icon-home"></i>  天气查询</a>
                                    </dd>
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/chouka" data-id="12" data-title="原神抽卡数据"><i class="layui-icon layui-icon-home"></i> 原神抽卡数据</a>
                                    </dd>
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/bilimes" data-id="9" data-title="B站评论"><i class="layui-icon layui-icon-home"></i>B站评论</a>
                                    </dd>
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/bili" data-id="10" data-title="B站评论分页查询"><i class="layui-icon layui-icon-home"></i> B站评论分页查询</a>
                                    </dd>
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/bilis" data-id="11" data-title="B站评论查询所有"><i class="layui-icon layui-icon-home"></i> B站评论查询所有</a>
                                    </dd>
                                </dl>
                            </li>
                            <li class="layui-nav-item">
                                <a href="javascript:;"><i class="layui-icon layui-icon-auz"></i>聊天管理</a>
                                <dl class="layui-nav-child">
                                    <dd>
                                        <a href="javascript:;" class="link-active" lay-href="/Home/chatpeople" data-id="4" data-title="聊天大厅"><i class="layui-icon layui-icon-home"></i>  聊天大厅</a>
                                    </dd>
                                </dl>
                            </li>*@
                            <li class="layui-nav-item">
                                <a href="javascript:;"><i class="layui-icon layui-icon-auz"></i>@item.dataname</a>
                                <dl class="layui-nav-child">
                                    @foreach (var obj in Model.Where(p => p.dataname==item.dataname).ToList())
                                    {
                                        <dd>
                                            <a href="javascript:;" class="link-active" lay-href="@obj.layhref" data-id="@obj.id" data-title="@obj.datatitle"><i class="@obj.classa"></i>@obj.datatitle</a>
                                        </dd>
                                        @*<dd>
                                            <a href="javascript:;" class="link-active" lay-href="/Home/userList" data-id="6" data-title="修改密码"><i class="layui-icon layui-icon-home"></i>@item.datatitle</a>
                                        </dd>*@
                                    }
                                </dl>
                            </li>
                        }
                    </ul>
                </div>
            </div>
            <div class="layui-body">
                <div class="layui-tab" lay-filter="tables" lay-allowclose="true">
                    <ul class="layui-tab-title"></ul>
                    <div class="layui-tab-content">
                    </div>
                </div>
            </div>

            <div class="layui-footer">
                <!-- 底部固定区域 q群：723868243-->
                <div class="pnl-support" id="copyright">欢迎来到梦染后台管理，项目地址<a href="https://gitee.com/gaochengshuo/meng-ran.git">https://gitee.com/gaochengshuo/meng-ran.git</a>，本系统正处于开发状态，</div>
            </div>

        </div>
    </div>

    <script>
        var isShow = true;
        //检测页面宽度
        $(window).resize(function () {
            var WIDTH = $(window).width();
            if (WIDTH < 990) {
                $('.layui-side.layui-bg-black').stop().animate({ width: '0px' }, 100, function () {
                    $('.layui-side.layui-bg-black').hide();
                });
                $('.layui-logo').stop().animate({ width: '0px' }, 100, function () {
                    $('.layui-logo').hide();
                });
            } else {
                if (isShow) {
                    $('.layui-side.layui-bg-black').stop().animate({ width: '200px' }, 100, function () {
                        $('.layui-side.layui-bg-black').show();
                    });
                    $('.layui-logo').stop().animate({ width: '200px' }, 100, function () {
                        $('.layui-logo').show();
                    });
                }
            }
        });

        $('#LAY_app_flexible').click(function () {
            $('.layui-nav-item city').each(function () {
                if ($(this).is(':hidden')) {
                    $(this).show();
                } else {
                    $(this).hide();
                }
            });

            //判断isshow的状态
            if (isShow) {
                $('.layui-side.layui-bg-black').width(0);
                $('.layui-nav-flex').width(0);
                //切换样式
                $('#LAY_app_flexible').removeClass("layui-icon-shrink-right");
                $('#LAY_app_flexible').addClass("layui-icon-spread-left");
                //头部样式
                $('.logo_dp').css("display", "none");
                $('.layui-logo').width(0);
                $('.layui-layout-left').css('left', 40 + 'px');
                $('#LAY_app_tabs').css('left', 0 + 'px');
                //将footer和body的宽度修改
                $('.layui-body').css('left', 0 + 'px');
                $('.layui-footer').css('left', 0 + 'px');
                //将二级导航栏隐藏
                $('dd a').each(function () {
                    $(this).hide();
                });

                $('.layui-nav-more').hide();

                //修改标志位
                isShow = false;
            } else {
                $('.layui-side.layui-bg-black').width(200);
                $('.layui-nav-flex').width(200);
                $('#LAY_app_flexible').removeClass("layui-icon-spread-left");
                $('#LAY_app_flexible').addClass("layui-icon-shrink-right");
                $('.logo_dp').css("display", "block");
                $('.layui-logo').width(200);
                $('.layui-layout-left').css('left', 200 + 'px');
                $('#LAY_app_tabs').css('left', 200 + 'px');
                $('.layui-body').css('left', 200 + 'px');
                $('.layui-footer').css('left', 200 + 'px');
                $('dd a').each(function () {
                    $(this).show();
                });

                $('.layui-nav-more').show();

                isShow = true;
            }
        });
    </script>
       <script>
        //JavaScript代码区域
        layui.use(['element', 'layer', 'jquery'], function () {
            var element = layui.element;
            var $ = layui.jquery;
            //左侧菜单点击事件
            $('.link-active').on('click', function () {
                var dataid = $(this);
                //判断右侧是否有tab
                if ($('.layui-tab-title li[lay-id]').length <= 0) {
                    tabFunction.tabAdd(dataid.attr('lay-href'), dataid.attr('data-id'), dataid.attr('data-title'));
                } else {
                    //判断tab是否已经存在
                    var isExist = false;
                    $.each($('.layui-tab-title li[lay-id]'), function () {
                        //筛选id是否存在
                        if ($(this).attr('lay-id') == dataid.attr("data-id")) {
                            isExist = true;
                        }
                    });
                    //不存在，增加tab
                    if (isExist == false) {
                        tabFunction.tabAdd(dataid.attr('lay-href'), dataid.attr('data-id'), dataid.attr('data-title'));
                    }
                }
                //转到要打开的tab
                tabFunction.tabChange(dataid.attr('data-id'));
            });
            //定义函数 绑定增加tab，删除tab，切换tab几项事件
            var tabFunction = {
                //新增tab url 页面地址 id 对应data-id name标题
                tabAdd: function (url, id, name) {
                    element.tabAdd('tables', {
                        title: name,
                        content: '<iframe data-frameid="' + id + '" scrolling="auto" frameborder="0" src="' + url + '" style="width:100%;height:800px" id="myIrame"></iframe>',
                        id: id
                    });
                },
                //根据id切换tab
                tabChange: function (id) {
                    element.tabChange('tables', id)
                },
                //关闭指定的tab
                tabDelete: function (id) {
                    element.tabDelete('tables', id)
                }
            }
        });
    </script>


</body>
</html>
